<!--
此文件为开发者工具生成，生成时间: 2022/7/8下午7:36:17
使用方法：
在 D:\web\web\五阶段\day10\my-app\unpackage\dist\dev\mp-weixin\pages\home\home.wxml 引入模板

```
<import src="home.skeleton.wxml"/>
<template is="skeleton" wx:if="{{loading}}" />
```

在 D:\web\web\五阶段\day10\my-app\unpackage\dist\dev\mp-weixin\pages\home\home.wxss 中引入样式
```
@import "./home.skeleton.wxss";
```

更多详细信息可以参考文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/skeleton.html
-->
<template name="skeleton">
  <view class="sk-container">
    <view class="sk-container">
      <view>
        <view class="top">
          <view class="top1">
            <view class="u-icon u-icon--u-icon data-v-2ee87dc9 u-icon--data-v-2ee87dc9 u-icon--right u-icon--u-icon--right" data-event-opts="tap,clickHandler,$event">
              <text class="u-icon__icon u-icon--u-icon__icon data-v-2ee87dc9 u-icon--data-v-2ee87dc9 uicon-map u-icon--uicon-map sk-transparent sk-text-0-0000-879 sk-text sk-image" style="font-size:16px;line-height:16px;font-weight:normal;top:0px;color:#606266"></text>
            </view>
            <view class="u-search search--u-search data-v-0a306a29 search--data-v-0a306a29" data-event-opts="tap,clickHandler,$event" style="margin:0">
              <view class="u-search__content search--u-search__content data-v-0a306a29 search--data-v-0a306a29" style="background-color:#f2f2f2;border-radius:100px;border-color:transparent;">
                <view class="u-search__content__icon search--u-search__content__icon data-v-0a306a29 search--data-v-0a306a29">
                  <view class="u-icon u-icon--u-icon data-v-2ee87dc9 u-icon--data-v-2ee87dc9 u-icon--right u-icon--u-icon--right" data-event-opts="tap,clickHandler,$event">
                    <text class="u-icon__icon u-icon--u-icon__icon data-v-2ee87dc9 u-icon--data-v-2ee87dc9 uicon-search u-icon--uicon-search sk-transparent sk-text-0-0000-670 sk-text sk-image" style="font-size:22px;line-height:22px;font-weight:normal;top:0px;color:#909399"></text>
                  </view>
                </view>
                <view class="u-search__content__input search--u-search__content__input data-v-0a306a29 search--data-v-0a306a29 sk-image" data-event-opts="blur,blur,$event,confirm,search,$event,input,inputChange,$event,focus,getFocus,$event" maxlength="-1"
                  placeholder="日照香炉生紫烟" placeholder-class="u-search__content__input--placeholder" placeholder-style="color: #909399" style="text-align:left;color:#606266;background-color:#f2f2f2;height:32px" type="text" value="true"></view>
              </view>
              <text class="u-search__action search--u-search__action data-v-0a306a29 search--data-v-0a306a29 u-search__action--active search--u-search__action--active sk-transparent sk-text-14-2857-357 sk-text sk-image" data-event-opts="tap,custom,$event"
                style="background-position-x: 50%;">搜索</text>
            </view>
          </view>
          <view class="u-tabs tabs--u-tabs data-v-48634e29 tabs--data-v-48634e29">
            <view class="u-tabs__wrapper tabs--u-tabs__wrapper data-v-48634e29 tabs--data-v-48634e29">
              <view class="u-tabs__wrapper__scroll-view-wrapper tabs--u-tabs__wrapper__scroll-view-wrapper data-v-48634e29 tabs--data-v-48634e29">
                <scroll-view class="u-tabs__wrapper__scroll-view tabs--u-tabs__wrapper__scroll-view data-v-48634e29 tabs--data-v-48634e29 vue-ref tabs--vue-ref" data-ref="u-tabs__wrapper__scroll-view" scroll-left="0" scroll-with-animation="true" scroll-x="true">
                  <view class="u-tabs__wrapper__nav tabs--u-tabs__wrapper__nav data-v-48634e29 tabs--data-v-48634e29 vue-ref tabs--vue-ref" data-ref="u-tabs__wrapper__nav">
                    <view class="u-tabs__wrapper__nav__item tabs--u-tabs__wrapper__nav__item data-v-48634e29 tabs--data-v-48634e29 vue-ref-in-for tabs--vue-ref-in-for u-tabs__wrapper__nav__item-0 tabs--u-tabs__wrapper__nav__item-0" data-event-opts="tap,clickHandler,$0,0,list,,0"
                      data-ref="u-tabs__wrapper__nav__item-0" style="height:44px;flex:">
                      <text class="u-tabs__wrapper__nav__item__text tabs--u-tabs__wrapper__nav__item__text data-v-48634e29 tabs--data-v-48634e29 sk-transparent sk-text-14-2857-441 sk-text sk-image" style="color:#303133">数码</text>
                    </view>
                    <view class="u-tabs__wrapper__nav__item tabs--u-tabs__wrapper__nav__item data-v-48634e29 tabs--data-v-48634e29 vue-ref-in-for tabs--vue-ref-in-for u-tabs__wrapper__nav__item-1 tabs--u-tabs__wrapper__nav__item-1" data-event-opts="tap,clickHandler,$0,1,list,,1"
                      data-ref="u-tabs__wrapper__nav__item-1" style="height:44px;flex:">
                      <text class="u-tabs__wrapper__nav__item__text tabs--u-tabs__wrapper__nav__item__text data-v-48634e29 tabs--data-v-48634e29 sk-transparent sk-text-14-2857-900 sk-text sk-image" style="color:#606266">家居</text>
                    </view>
                    <view class="u-tabs__wrapper__nav__item tabs--u-tabs__wrapper__nav__item data-v-48634e29 tabs--data-v-48634e29 vue-ref-in-for tabs--vue-ref-in-for u-tabs__wrapper__nav__item-2 tabs--u-tabs__wrapper__nav__item-2" data-event-opts="tap,clickHandler,$0,2,list,,2"
                      data-ref="u-tabs__wrapper__nav__item-2" style="height:44px;flex:">
                      <text class="u-tabs__wrapper__nav__item__text tabs--u-tabs__wrapper__nav__item__text data-v-48634e29 tabs--data-v-48634e29 sk-transparent sk-text-14-2857-327 sk-text sk-image" style="color:#606266">家电</text>
                    </view>
                    <view class="u-tabs__wrapper__nav__item tabs--u-tabs__wrapper__nav__item data-v-48634e29 tabs--data-v-48634e29 vue-ref-in-for tabs--vue-ref-in-for u-tabs__wrapper__nav__item-3 tabs--u-tabs__wrapper__nav__item-3" data-event-opts="tap,clickHandler,$0,3,list,,3"
                      data-ref="u-tabs__wrapper__nav__item-3" style="height:44px;flex:">
                      <text class="u-tabs__wrapper__nav__item__text tabs--u-tabs__wrapper__nav__item__text data-v-48634e29 tabs--data-v-48634e29 sk-transparent sk-text-14-2857-201 sk-text sk-image" style="color:#606266">箱包</text>
                    </view>
                    <view class="u-tabs__wrapper__nav__item tabs--u-tabs__wrapper__nav__item data-v-48634e29 tabs--data-v-48634e29 vue-ref-in-for tabs--vue-ref-in-for u-tabs__wrapper__nav__item-4 tabs--u-tabs__wrapper__nav__item-4" data-event-opts="tap,clickHandler,$0,4,list,,4"
                      data-ref="u-tabs__wrapper__nav__item-4" style="height:44px;flex:">
                      <text class="u-tabs__wrapper__nav__item__text tabs--u-tabs__wrapper__nav__item__text data-v-48634e29 tabs--data-v-48634e29 sk-transparent sk-text-14-2857-58 sk-text sk-image" style="color:#606266">食品</text>
                    </view>
                    <view class="u-tabs__wrapper__nav__line tabs--u-tabs__wrapper__nav__line data-v-48634e29 tabs--data-v-48634e29 vue-ref tabs--vue-ref" data-ref="u-tabs__wrapper__nav__line" style="width:20px;transform:translate(16px);transition-duration:300ms;height:3px;background:#3c9cff;background-size:cover;"></view>
                  </view>
                </scroll-view>
              </view>
            </view>
          </view>
        </view>
        <view class="lun">
          <view class="u-swiper swiper--u-swiper data-v-6b019429 swiper--data-v-6b019429" style="background-color:#f3f4f6;height:228px;border-radius:4px;">
            <swiper autoplay="false" class="u-swiper__wrapper swiper--u-swiper__wrapper data-v-6b019429 swiper--data-v-6b019429" current="0" data-event-opts="change,change,$event" display-multiple-items="1" duration="300" easing-function="default" interval="1000"
              next-margin="0px" previous-margin="0px" style="height:228px;" circular="true"></swiper>
            <view class="u-swiper__indicator swiper--u-swiper__indicator data-v-6b019429 swiper--data-v-6b019429" style="true">
              <view class="u-swiper-indicator indicator--u-swiper-indicator data-v-56090129 indicator--data-v-56090129">
                <view class="u-swiper-indicator__wrapper indicator--u-swiper-indicator__wrapper data-v-56090129 indicator--data-v-56090129 u-swiper-indicator__wrapper--line indicator--u-swiper-indicator__wrapper--line" style="width:110px;background-color:rgba(255, 255, 255, 0.35);">
                  <view class="u-swiper-indicator__wrapper--line__bar indicator--u-swiper-indicator__wrapper--line__bar data-v-56090129 indicator--data-v-56090129" style="width:22px;transform:translateX(88px);background-color:#FFFFFF"></view>
                </view>
              </view>
            </view>
          </view>
        </view>
        <view class="lx">
          <view class="u-grid grid--u-grid data-v-121efd29 grid--data-v-121efd29 vue-ref grid--vue-ref" data-ref="u-grid" style="justify-content:flex-start">
            <view class="u-grid-item item--u-grid-item data-v-5b3a01af item--data-v-5b3a01af" data-event-opts="tap,clickHandler,$event" hover-class="u-grid-item--hover-class" hover-stay-time="200" style="background:transparent;width:20%">
              <image mode="true" class="sk-image"></image>
              <text class="grid-text sk-transparent sk-text-14-2857-862 sk-text sk-image">限时抢购</text>
            </view>
            <view class="u-grid-item item--u-grid-item data-v-5b3a01af item--data-v-5b3a01af" data-event-opts="tap,clickHandler,$event" hover-class="u-grid-item--hover-class" hover-stay-time="200" style="background:transparent;width:20%">
              <image mode="true" class="sk-image"></image>
              <text class="grid-text sk-transparent sk-text-14-2857-348 sk-text sk-image">畅销商品</text>
            </view>
            <view class="u-grid-item item--u-grid-item data-v-5b3a01af item--data-v-5b3a01af" data-event-opts="tap,clickHandler,$event" hover-class="u-grid-item--hover-class" hover-stay-time="200" style="background:transparent;width:20%">
              <image mode="true" class="sk-image"></image>
              <text class="grid-text sk-transparent sk-text-14-2857-162 sk-text sk-image">品质大牌</text>
            </view>
            <view class="u-grid-item item--u-grid-item data-v-5b3a01af item--data-v-5b3a01af" data-event-opts="tap,clickHandler,$event" hover-class="u-grid-item--hover-class" hover-stay-time="200" style="background:transparent;width:20%">
              <image mode="true" class="sk-image"></image>
              <text class="grid-text sk-transparent sk-text-14-2857-886 sk-text sk-image">小U自营</text>
            </view>
            <view class="u-grid-item item--u-grid-item data-v-5b3a01af item--data-v-5b3a01af" data-event-opts="tap,clickHandler,$event" hover-class="u-grid-item--hover-class" hover-stay-time="200" style="background:transparent;width:20%">
              <image mode="true" class="sk-image"></image>
              <text class="grid-text sk-transparent sk-text-14-2857-734 sk-text sk-image">积分越换</text>
            </view>
          </view>
          <view class="u-toast toast--u-toast data-v-0c6e2509 toast--data-v-0c6e2509"></view>
        </view>
        <view class="t">
          <view class="t1">
            <view class="wz">
              <text class="xs sk-transparent sk-text-14-2857-821 sk-text sk-image">限时秒杀</text>
              <text class="sk-transparent sk-text-14-2857-820 sk-text sk-image">查看更多&gt;</text>
            </view>
            <view class="stop sk-transparent sk-text-14-2857-463 sk-text sk-image">每天0点场，好货秒不停</view>
            <view class="time sk-transparent">
              <text class="sk-transparent sk-text-14-2857-385 sk-text sk-image">05</text>:
              <text class="sk-transparent sk-text-14-2857-595 sk-text sk-image">05</text>:
              <text class="sk-transparent sk-text-14-2857-386 sk-text sk-image">48</text>
            </view>
          </view>
          <view class="t2">
            <view class="yt">
              <view class="new sk-transparent sk-text-14-2857-126 sk-text sk-image">品牌上新</view>
              <view class="time sk-transparent sk-text-14-2857-343 sk-text sk-image">九点整，抢大牌</view>
              <view class="hb sk-transparent sk-text-14-2857-49 sk-text sk-image">疯狂抢红包&gt;</view>
            </view>
            <view class="yt1">
              <view class="new sk-transparent sk-text-14-2857-631 sk-text sk-image">日用好物</view>
              <view class="time sk-transparent sk-text-14-2857-991 sk-text sk-image">愿君多采撷</view>
              <view class="hb sk-transparent sk-text-14-2857-9 sk-text sk-image">塞满奖卷&gt;</view>
            </view>
          </view>
        </view>
        <view class="shiy">
          <view class="q">
            <text class="sk-transparent sk-text-14-2857-277 sk-text sk-image">双十一</text>
            <text class="sk-transparent sk-text-14-2857-693 sk-text sk-image">畅销全部</text>
          </view>
          <view class="t">
            <image mode="true" class="sk-image"></image>
            <image mode="true" class="sk-image"></image>
            <image mode="true" class="sk-image"></image>
            <image mode="true" class="sk-image"></image>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
</script>

<style>
	/*
	此文件为开发者工具生成，生成时间: 2022/7/8下午7:36:17
	
	在 D:\web\web\五阶段\day10\my-app\unpackage\dist\dev\mp-weixin\pages\home\home.wxss 中引入样式
	```
	@import "./home.skeleton.wxss";
	```
	
	更多详细信息可以参考文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/skeleton.html
	*/
	.sk-transparent {
	    color: transparent !important;
	  }
	.sk-image {
	    background: #EFEFEF !important;
	  }
	.sk-container {
	    position: absolute;
	    left: 0;
	    top: 0;
	    width: 100%;
	    height: 100%;
	    overflow: hidden;
	    background-color: transparent;
	  }

</style>